<template>
	<div class="trainChangeFillOrder train" v-if="msg">
		<trainHeader name="订单填写" btn="改签须知" @btnClick="btnClick"></trainHeader>
		<!--车次详情-->
		<trainlistdetails :msg="msg" :departureDate="departureDate"></trainlistdetails>
		<div class="trainChangeFillOrder_seatName">
			<span>{{seatMessage.seatName}}</span>
			<span>￥{{seatMessage.lowestPrice}}</span>
		</div>
		<div class="trainChangeFillOrder_passenger" v-if="changeMessage">
			<div class="trainChangeFillOrder_passenger_message" v-for="item,key in changeMessage.passenger" v-if="!key">
				<div class="trainChangeFillOrder_passenger_name">
					<span>{{item.passengerName}}</span>
					<!--<em v-if="item.passengerType == 1">成人</em>-->
					<em v-if="item.passengerType == 2" class="child">儿童票</em>
					<em v-if="item.passengerType == 3">学生票</em>
				</div>
				<div class="active">
					<span v-if="item.idType == 1">
						身份证：
					</span>
					<span v-else-if="item.idType == 2">
						护照：
					</span>
					<span v-else-if="item.idType == 8">
						台胞证：
					</span>
					<span v-else-if="item.idType== 10">
						港澳通行证：
					</span>
					<span>
						{{item.idCard | getNum}}
					</span>
				</div>
			</div>
		</div>
		<div class="trainChangeFillOrder_bottom">
			<div class="trainChangeFillOrder_tip"  v-if="seatMessage.seatName=='硬卧' || seatMessage.seatName=='软卧' || seatMessage.seatName=='高级软卧'">卧铺按上铺票价显示，占座成功后支付实际价格 </div>
			<div class="trainChangeFillOrder_btn" @click="checkChange">
				改签
			</div>
		</div>
		<!--蒙层-->
		<kpmask v-show="orderNum"></kpmask>
		<!--出票弹窗-->
		<trainGetSeat v-if="orderNum" :msg="msg" :passengerList="changeMessage.passenger" :orderNum="orderNum"></trainGetSeat>
	</div>
</template>
<style scoped>
	
	.trainChangeFillOrder {
		padding-bottom: 170px;
	}
	
	.trainChangeFillOrder_seatName {
		margin: 0 17px;
		height: 88px;
		background: #fff;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		padding-left: 13px;
		border-radius: 0 0px 10px 10px;
		font-size: 28px;
		color: #333333;
	}
	
	.trainChangeFillOrder_seatName>span {
		margin-right: 20px;
	}
	
	.trainChangeFillOrder_passenger {
		background-color: #ffffff;
		border-radius: 10px;
		margin: 21px 17px 0;
		padding: 0px 56px;
	}
	
	.trainChangeFillOrder_passenger_message {
		padding: 26px 0;
	}
	
	.trainChangeFillOrder_passenger_message>div {
		margin-bottom: 24px;
		font-size: 32px;
		color: #333333;
	}
	
	.trainChangeFillOrder_passenger_message>div.active {
		font-size: 28px;
		color: #a8a8a8;
	}
	
	.trainChangeFillOrder_passenger_message>div:last-child {
		margin-bottom: 0;
	}
	
	.trainChangeFillOrder_passenger_name {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}
	
	.trainChangeFillOrder_passenger_name>em {
		font-size: 24px;
		color: #fb6523;
		width: 94px;
		height: 36px;
		display: flex;
		justify-content: center;
		align-items: center;
		background-color: #ffc2a7;
		font-weight: 700;
		margin-left: 20px;
	}
	
	.trainChangeFillOrder_passenger_name>em.child {
		color: #ffffff;
		background-color: #f7c413;
	}
	
	.trainChangeFillOrder_bottom {
		padding-bottom: 34px;
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
		position: fixed;
		left: 0;
		bottom: 0;
		width: 100%;
		box-sizing: border-box;
		background: #F4F5F9;
	}
	
	.trainChangeFillOrder_tip {
		background:#FCFDED;
		font-size:26px;
		color:#EC7150;
		padding:10px 50px;
		width:100%;
		box-sizing: border-box;
	}
	
	.trainChangeFillOrder_btn {
		width: 714px;
		height: 98px;
		background-color: #3bc3c2;
		border-radius: 49px;
		font-size: 36px;
		color: #fefefe;
		display: flex;
		justify-content: center;
		align-items: center;
	}
</style>
<script>
	import trainlistdetails from "../../../components/trainListDetails"; //详情
	import trainHeader from "../../../components/trainHeader";//头部
	import trainGetSeat from "../../../components/trainGetSeat"; //占座
	import kpmask from "../../../components/kpmask"; //蒙层 //层级300
	export default {
		name: "trainChangeFillOrder",
		data() { //数据
			return {
				msg: null,//车次信息
				queryKey: "",//请求key
				departureDate: "",//日期
				seatMessage: "",//坐席信息
				ticketType: "",//车票类型
				changeMessage: null, //改签信息
				maskFlag:false,//占座进度条
				orderNum:"",//订单号
				passengerId:"",//改签的乘客Id
			}
		},
		mounted() {
			this.trainNo = this.$route.query.trainNo; //车次
			this.fromStation = this.$route.query.fromStation; //车站
			this.toStation = this.$route.query.toStation;
			this.departureDate = this.$route.query.departureDate; //日期
			this.getList(); //获取列表
			(this.$route.query.seatMessage) && (this.seatMessage = JSON.parse(this.$route.query.seatMessage)); //座位信息
			this.ticketType = Number(this.$route.query.ticketType); //车票详情 0普通 1抢票
			this.changeMessage = this.$store.state.train.trainStore.changeMessage; //改签信息
			this.getPassenger();//处理乘客信息
		},
		created() {
			
		},
		methods: {
			getList() { //获取信息列表
				this.$loading.show();
				var param = {
					fromStation: encodeURI(this.fromStation),
					toStation: encodeURI(this.toStation),
					ticketType: this.studentFlag ? 2 : 1, // 1正常票  2学生票  默认1
					trainDate: this.departureDate.replace(/-/g, ''),
				};
				this.$http.post(this.$baseUrl.baseurl + "tctrain/train/train", param).then((res) => {
					this.isShowFlag = true;
					if(res.data.Result.trains) {
						var list = res.data.Result.trains;
						var trainNo = this.trainNo;
						var middata = list.filter(function(elem) {
							return elem.trainNo == trainNo;
						});
						if(!middata.length) {
							this.$loading.hide();
							this.$toast("没有找到该车次", {
								durtaion: 200,
								location: 'center',
							});
							this.getDepartureDate(); //改日期
							return;
						};
						var ticketsArr = []; //处理座次排序
						for(var item in middata[0].tickets) { //获取座位信息
							let obj = middata[0].tickets[item];
							obj.seatClass = item; //添加坐席代号
							ticketsArr.push(obj);
						};
						ticketsArr.sort((a, b) => { //根据价格排序
							var a = a.lowestPrice || a.price;
							var b = b.lowestPrice || b.price;
							return b - a;
						});
						if(ticketsArr.length > 1) { //处理无座和硬座/二等座价格相同的情况
							var flag = (ticketsArr[ticketsArr.length - 1].seatName == "硬座" || ticketsArr[ticketsArr.length - 1].seatName == "二等座") && (ticketsArr[ticketsArr.length - 2].seatName == "无座");
							if(flag) {
								let obj = ticketsArr[ticketsArr.length - 2];
								ticketsArr[ticketsArr.length - 2] = ticketsArr[ticketsArr.length - 1];
								ticketsArr[ticketsArr.length - 1] = obj;
							};
						};
						middata[0].ticketsArr = ticketsArr;
						this.msg = middata[0];
						this.queryKey = res.data.Result.queryKey;
						this.getDepartureDate();
						var timer = setTimeout(function() {
							clearTimeout(timer);
							(this.ticketType) && (this.robTicketSpeedUpLineWidth = document.getElementById("robTicketSpeedUpLine").offsetWidth); //抢票获取滑动条的宽度	
						}.bind(this), 100);
						this.$loading.hide();
					} else {
						this.$loading.hide();
						this.getDepartureDate(); //改日期
						this.$toast("没有找到该车次", {
							durtaion: 200,
							location: 'center',
						});
					};
				}).catch((err) => {
					this.$loading.hide();
					console.log(err);
				});
			},
			getDepartureDate() { //处理时间信息
				this.msg.startDate = this.$publicMethod.getWeek(this.departureDate + " " + this.msg.fromTime);
				this.msg.endDate = this.$publicMethod.getWeek(new Date(this.msg.startDate.dateMsg.getTime() + (this.msg.runTimeSpan * 60 * 1000)).format("yyyy-MM-dd hh:mm:ss"));
				this.departureDateMsg = this.$publicMethod.getWeek(this.departureDate);
			},
			getPassenger(){//修改乘客的顺序
			    var passenger = this.changeMessage.passenger;
			    if(passenger[0].passengerType == 2){//第一个是儿童则调换为成人
			      let key = "";
			      passenger.forEach((val, index) => {
			        (val.passengerType == 1) && (key = index);
			      });
			      let obj = passenger[key];
			      passenger.splice(key,1);
			      passenger.unshift(obj);
			    };
//			    (this.changeMessage.types == 7) && passenger.forEach((val,index)=>{ //抢票单乘客证件号类型加1
//			      passenger[index].idType = val.idType + 1;
//			    });
			},
			btnClick() {
				this.$router.push({ //预定或抢票须知
					name: "reserve",
					query: {
						isChangTicket: 1,
					},
				});
			},
			checkChange(){//校验改签
			    this.changeMessage.passenger.forEach((val)=>{//获取乘客中的非儿童
			    	(val.passengerType != 2) && (this.passengerId = val.passengerId);
			    },this);
			    this.$loading.show();
				var param = {
					checkType: '0',
			        method: "applyRefundOrder",
			        orderNo: this.changeMessage.orderNo,
			        passengerId: this.passengerId,
			        tof: ''
				}
				this.$http.post(this.$baseUrl.baseurl + "tctrain/train/changeTicketVerification", param).then((res) => {
					this.$loading.hide();
					(res.data.Code == "0") ? this.checkChangeStation(res.data.Result) : this.$toast(res.data.msg, {
						durtaion: 200,
						location: 'center',
					});
				}).catch((err) => {
					this.$loading.hide();
					console.log(err);
				});
			},
			checkChangeStation(data){ //校验改签到站
				this.$loading.show();
				var param = {
					fromStation: encodeURI(this.changeMessage.fromStation),
			        toStation: encodeURI(this.changeMessage.toStation),
			        trainData: new Date(this.changeMessage.departDate.replace(/-/g,"/")).format('YYYY-MM-dd'),//发车时间,
			        changeFromStation: encodeURI(this.changeMessage.fromStation),
			        changeToStation: encodeURI(this.changeMessage.toStationName),
			        changeTrainData:this.changeMessage.departureDate,
			        isStudent:"0",
				};
				this.$http.post(this.$baseUrl.baseurl + "tctrain/train/getChangStationType", param).then((res) => {
					this.$loading.hide();
					(res.data.Code == "0") ? this.change(data,res.data.Result.isChangeStation) : this.change(data,this.changeMessage.isChangeStation ? "1" : "0");
				}).catch((err) => {
					this.$loading.hide();
					console.log(err);
				});
			},
			change(data,isChangeStation){//改签
				var param = {
					isH5Version: 2,//区别H5俩个小程序
					arrivalTime:new Date(this.msg.endDate.dateMsg).format('YYYY-MM-dd hh:mm'),//到达时间
					departureTime:new Date(this.msg.startDate.dateMsg).format('YYYY-MM-dd hh:mm'),//发车时间
					fromStation:encodeURI(this.msg.fromStation),//出发地
					fromStationCode: this.msg.fromStationCode,//出发地Code
					isChangeStation: isChangeStation,//是否变跟到站
					isProduction: "0",//占座信息推送地址环境设置 0：测试环境 1：生产环境 无特殊需求请传1（必填）
        			noticeType: "0",//占座出票通知是否合并
        			orderNo:this.changeMessage.orderNo,//订单号
        			outOrderNo:this.changeMessage.outOrderNo,//订单号
        			orderPrice:this.seatMessage.price.toString(), //订单价
        			passengerId:this.passengerId,//乘客id
        			queryKey:this.queryKey,//请求key
        			seatClass:this.seatMessage.seatClass,//坐席code
        			seatClassName: encodeURI(this.seatMessage.seatName),//坐席信息
        			ticketPrice:this.seatMessage.price.toString(),//车票价
        			ticketType:this.changeMessage.types,//订单类型
        			toStation:encodeURI(this.msg.toStation),//到达站
        			toStationCode:this.msg.toStationCode,//到达站code
        			tof:"",
        			totalPrice:this.seatMessage.price.toString(),//总价
        			trainDate:this.departureDate,//日期
        			trainNo:this.msg.trainNo,//车次号
        			userID:this.$store.state.common.userinfo.userID,//userId
				};
//				console.log(param,data);
				this.$http.post(this.$baseUrl.baseurl + "tctrain/train/applyChangeTicket", param).then((res) => {
					this.$loading.hide();
					if (res.data.Code == "0") {
						this.orderNum = res.data.Result.outOrderNo;
					} else {
						this.$toast(res.data.msg, {
							durtaion: 200,
							location: 'center',
						});
					};
				}).catch((err) => {
					this.$loading.hide();
					console.log(err);
				});
			},
		},
		filters: {
			getNum(num) { //证件号加密
				(typeof num == "String") || (num = String(num));
				var length = num.length;
				var str = "";
				for(var i = 0; i < length - 2; i++) {
					str += "*"
				};
				return num.substring(0, 1) + str + num.substring(num.length - 1, num.length);
			},
		},
		components: {
			trainHeader,
			trainlistdetails,
			trainGetSeat,
			kpmask
		},
	};
</script>